/* 标题*/
.titd{
    font-size: 24px;
    font-weight: 700;
  }
  
  *{
    padding: 0;
    margin: 0;
  }
  
  /* 字体大小 */
  .f-icontext{font-size: 11px}/* 很小的文字,一般和图标一起使用 */
  .f-caption{font-size: 12px;}/* 辅助描述性文字 */
  .tf-paragraph{font-size: 14px;}/* 段落字体 */
  .f-title{font-size: 16px;}/* 标题 */
  .f-big-title{font-size: 20px;}/* 大点的标题 */
  .f-s-24{font-size: 24px}
  .f-s-14{font-size: 14px}
  .f-s-16{font-size: 16px}
  .f-s-18{font-size: 18px}
  .f-s-20{font-size: 20px}
  .f-s-21{font-size: 21px}
  .f-s-22{font-size: 22px}
  .f-s-23{font-size: 23px}
  .f-s-25{font-size: 25px}
  .f-s-30{font-size: 30px}
  .f-s-40{font-size: 40px}
  .f-w-200{font-weight:400;}
  .f-w-400{font-weight:400;}
  .f-w-bold{font-weight:bold}
  /* 字体颜色 */
  .c-base{color:#ffffff;}/* 白色 */
  .c-black{color: #000000;}/* 黑色 */
  .c-title{color: #e2e2e2}/* 标题/副标题 */
  .c-caption{color:#999999;}/* 辅助描述性文字 */
  .c-paragraph{color:#666666;}/* 段落字体 */
  .c-success{color:#13C3A6;}/* 成功/链接文字 */
  .c-tips{color:#ffd753;}/* 失效 */
  .c-warning{color:#f12c20;}/* 警告/非法 */
  .c-nodata{color:#cccccc;}/* 链接文字 */
  .c-shadow{text-shadow:1px 1px 1px #808080;}/* 字体阴影 */
  .c-133{color: #303133}
  .c-red{color: #D40000}
  .c-blue{color: #3A85F5}
  .c-999{color: #999999}
  .c-222{color: #222222}
  .c-666{color: #666666}
  .c-F62{color: #EE6F62;}
  .c-70F{color: #FF970F}
  .c-EFF{color: #409EFF}
  .c-7FA{color: #F5F7FA}
  .c-FF7013{color: #FF7013;}
  .c-reds{color: #ff0000}
  .c-EC6354{color: #EC6354}
  .c-F8F8F8{color: #F8F8F8;}
  .c-EBEDFO{color: #EBEDF0}
  /*宽度设置*/
  .wh{width:100% !important}
  .wh5{width:5%}
  .wh10{width:10%}
  .wh15{width:15%}
  .wh17{width:17%}
  .wh20{width:20%}
  .wh33{width:33.33%}
  .wh25{width:25%}
  .wh30{width:30%}
  .wh40{width:40%}
  .wh45{width:45%}
  .wh48{width:48%}
  .wh50{width:50%}
  .wh60{width:60%}
  .wh70{width:70%}
  .wh80{width:80% }
  .wh82{width:82% }
  .wh85{width:85% }
  .wh90{width:90% }
  .w120{width:120px }
  .w200{width:200px}
  .w300{width:300px}
  .w400{width:400px}
  .w500{width:500px}
  .w550{width:550px}
  .w600{width:600px}
  .w700{width:700px}
  .w105{width:1050px}
  .w10{width: 10px;}
  .w70{width:70px}
  .w150{width:150px}
  .w100{width:100px}
  .w200{width:200px}
  .wauto{width:auto}
  /* border */
  .bott{border: 1px solid #e1e1e1}
  .bott-l{border-left: 1px solid  #e1e1e1;}
  .bott-r{border-right: 1px solid  #e1e1e1;}
  .bott-t{border-top: 1px solid  #e1e1e1;}
  .bott-b{border-bottom: 1px solid  #e1e1e1;}
  /*取消border*/
  .bortop{border-top:none}
  .borleft{border-left:none}
  .borright{border-right:none}
  .borbottom{border-bottom:none}
  
  
  .buttnone{border: none!important;background: none!important;}
  /* 填充色 */
  .color_rb{color: red;}
  .fill-base{background:#ffffff;}/* 默认 */
  .fill-body{background:#f4f6f8;}/* 页面 */
  .fill-primary{background:#13C3A6;}/* 主题色/主要活动按钮 */
  .fill-caption{background:#ffd753;}/* 辅助色 */
  .fill-warning{background:#f12c20;}/* 警告/非法 */
  .fill-second{background:#efeff4;}/* 区块分割线 */
  .fill-space{background:#eeeeee;}/* 次要活动按钮 */
  .bg-blue{background: #0B5CFF}
  .bg-DF0{background: #EBEDF0}
  .bg-00B{background: #FFA00B}
  .bg-C7C{background: #C7C7C7!important;}
  .bg-7FA{background: #F5F7FA}
  .bg-F8F8F8{background: #F8F8F8;}
  .colour{background: #F8F8F8;}
  .bg-EBEDFO{background: #EBEDF0}
  
  /* 阴影 */
  .box-shadow{box-shadow:0 2px 15px rgba(21,13,13,0.05);}
  .box-shadow-mini{box-shadow: 1px 0 5px rgba(4,0,0,0.08);}
  .box-shadow-EBEDFO{box-shadow:0 2px 15px #EBEDF0;}
  /* 字体样式 */
  text{vertical-align: middle;}/* 上下居中 */
  .text-left{text-align: left;}/* 左对齐 */
  .text-center { text-align: center}/* 中对齐 */
  .text-right {text-align: right}/* 右对齐 */
  .text-justify{text-align: justify;}/* 两端对齐，谨慎使用 */
  .text-justify::after{content: '';width: 100%;display: inline-block;}
  .text-delete {text-decoration: line-through}/* 删除线 */
  .text-underline{text-decoration: underline}/* 下划线 */
  .text-bold{ font-weight:bold;}/* 加粗 */
  
  
  /* 文本溢出省略 */
  .ellipsis{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
  .F{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:2;overflow: hidden;}
  .ellipsis-3{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:3;overflow: hidden;}
  .ellipsis-4{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:4;overflow: hidden;}
  
  
  /* 最大宽度 */
  .max-300{max-width: 150px;}
  .max-380{max-width: 190px;}
  .max-456{max-width: 228px;}
  .max-500{max-width: 150px;}
  .max-520{max-width: 260px;}
  .max-550{max-width: 275px;}
  .max-566{max-width: 288px;}
  .max-580{max-width: 290px;}
  
  
  .h{height: 100%;}
  .h-20{height: 20px;}
  .h-30{height: 30px;}
  
  .h-100{height: 50px;}
  .h-140{height: 70px;}
  .h-64{height: 32px;}
  .h-1{height: 1px;}
  .h500{height: 280px;}
  .h-80{height: 40px;}
  .h-50{height: 50%;}
  .lh-20{line-height: 20px;}
  .lh-36{line-height: 36px;}
  .lh-27{line-height: 27px;}
  .lh-30{line-height: 30px;}
  .lh-40{line-height: 40px;}
  /* 外间距 */
  .mg-0{margin:0px!important}
  .mg-sm{margin:5px;}
  .mg-md{margin:10px;}
  .mg-lg{margin:16px;}
  .mg-20{margin:20px;}
  .mg-24{margin:24px;}
  .mg-30{margin:30px;}
  .mg-40{margin:40px;}
  
  .mt-sm{margin-top:5px;}
  .mt-md{margin-top:10px;}
  .mt-lg{margin-top:16px;}
  .mt-20{margin-top:20px;}
  .mt-21{margin-top:21px;}
  .mt-24{margin-top:24px;}
  .mt-30{margin-top:30px;}
  .mt-40{margin-top:40px;}
  .mt-50{margin-top:50px;}
  .mr-sm{margin-right:5px;}
  .mr-md{margin-right:10px;}
  .mr-lg{margin-right:16px;}
  .mr-20{margin-right:20px;}
  .mr-24{margin-right:24px;}
  .mr-30{margin-right:30px;}
  .mr-40{margin-right:40px;}
  .mr-60{margin-right:60px;}
  .mr-100{margin-right:100px;}
  .mr-log{margin-right:30px;}
  
  .mb-sm{margin-bottom:5px;}
  .mb-md{margin-bottom:10px;}
  .mb-lg{margin-bottom:16px;}
  .mb-24{margin-bottom:24px;}
  .mb-30{margin-bottom:30px;}
  .mb-40{margin-bottom:40px;}
  .mb-50{margin-bottom:50px;}
  .mb-60{margin-bottom:60px;}
  .mb-70{margin-bottom:70px;}
  .mb-80{margin-bottom:80px;}

  .ml-sm{margin-left:5px;}
  .ml-md{margin-left:10px;}
  .ml-lg{margin-left:16px;}
  .ml-20{margin-left:20px;}
  .ml-24{margin-left:24px;}
  .ml-25{margin-left:25px;}
  .ml-30{margin-left:30px;}
  .ml-40{margin-left:40px!important;}
  .ml-50{margin-left:50px;}
  .ml-60{margin-left:60px;}
  .ml-80{margin-left:80px;}
  .ml-100{margin-left:100px;}
  .ml-110{margin-left:110px;}
  .ml-120{margin-left:120px;}
  
  
  /* 内间距 */
  .pd-0{padding: 0 !important;}
  .pd-sm{padding:5px;}
  .pd-md{padding:10px;}
  .pd-lg{padding:16px;}
  .pd-20{padding:20px;}
  .pd-24{padding:24px;}
  .pd-30{padding:30px;}
  .pd-40{padding:40px;}
  
  .pt-sm{padding-top:5px;}
  .pt-md{padding-top:10px;}
  .pt-lg{padding-top:16px;}
  .pt-20{padding-top:20px;}
  .pt-24{padding-top:24px;}
  .pt-30{padding-top:30px;}
  .pt-40{padding-top:40px;}
  
  
  .pr-sm{padding-right:5px;}
  .pr-md{padding-right:10px;}
  .pr-lg{padding-right:16px;}
  .pr-30{padding-right:30px;}
  .pr-50{padding-right:50px;}
  .pr-100{padding-right:100px;}
  
  .pb-sm{padding-bottom:5px;}
  .pb-md{padding-bottom:10px;}
  .pb-lg{padding-bottom:16px;}
  .pb-20{padding-bottom:20px;}
  .pb-30{padding-bottom:30px;}

  .pl-0{padding-left:0px !important;}
  .pl-sm{padding-left:5px;}
  .pl-md{padding-left:10px;}
  .pl-lg{padding-left:16px;}
  .pl-20{padding-left:20px;}
  .pl-24{padding-left:24px;}
  .pl-30{padding-left:30px;}
  .pl-40{padding-left:40px;}
  .pl-50{padding-left:50px;}
  .pl-60{padding-left:60px;}
  .pl-65{padding-left:65px;}
  .pl-100{padding-left:65px;}
  .boxsi{box-sizing: border-box;}
  
  /* 图标尺寸 */
  .icon-xs{width:16px; height:16px;display: block;font-size: 16px;}
  .icon-sm{width:22px; height:22px;display: block;font-size: 22px;}
  .icon-md{width:30px; height:30px;display: block;font-size: 30px;}
  .icon-lg{width:40px; height:40px;display: block;font-size: 40px;}
  
  
  /* 组件间距 */
  .space-sm{height: 5px;}
  .space-md{height: 10px;}
  .space-lg{height: 16px;}
  .space-body{height: 75px;}
  .space{height: 1px ;background: rgba(216, 216, 216, 0.5);}
  
  
  /* 圆角 */
  .radius{border-radius: 5000px;}
  .radius-5 {border-radius: 3px;}
  .radius-10 {border-radius: 5px;}
  .radius-15 {border-radius: 8px;}
  .circle{border-radius: 50%;}
  
  /* 旋转 */
  .rotate-45{transform: rotate(45deg);}
  .rotate-90{transform: rotate(90deg);}
  .rotate-270{transform: rotate(270deg);}
  
  /* 定位 */
  .rel{position: relative;}
  .abs{position: absolute;}
  .fix{position: fixed;width: 100%;z-index: 100;}
  .abs-left{left: 0}
  .abs-right{right: 0}
  .abs-top{top: 0}
  .abs-bottom{bottom: 0}
  
  /* 固定 */
  .fixed-top{position: fixed;left: 0;right: 0;top: 0;z-index: 100;}
  .fixed-bottom{position: fixed;left: 0;right: 0;bottom: 0;z-index: 100;}
  /* 灰度 */
  .grayscale {-webkit-filter: grayscale(100%);filter: grayscale(100%);}
  /*指针*/
  .cursor-no{cursor: no-drop;}
  .pointer{cursor:pointer}
  /*flex布局,可以自己定义适合自己的*/
  .flex {display: flex;}
  .new-flex{display: flex ;}
  .flex-1 {flex: 1;}
  .flex-1_5 {flex: 1.5;}
  .flex-2 {flex: 2;}
  .flex-3 {flex: 3;}
  .flex-4 {flex: 4;}
  .flex-5 {flex: 5;}
  
  
  .flex-column {
      display: flex;
      flex-direction: column;
  }
  .flex-right {
    display: flex;
    flex-direction: row-reverse;
  }
  .flex-warp {
      display: flex;
      flex-wrap: wrap;
  }
  
  .flex-center {
      display: flex;
      align-items: center;
      justify-content: center;
  }
  
  .flex-between {
      display: flex;
      align-items: center;
      justify-content: space-between;
  }
  
  .flex-around {
      display: flex;
      align-items: center;
      justify-content: space-around;
  }
  
  .flex-x-center {
      display: flex;
      justify-content: center;
  }
  
  .flex-x-between {
      display: flex;
      justify-content: space-between;
  }
  .flex-x-around {
    display: flex;
    justify-content: space-around;
  }
  .flex-yx-center{
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .flex-y-center {
      display: flex;
      align-items: center;
  }
  
  .flex-y-start {
      display: flex;
    align-items: flex-start;
  }
  .flex-x-start {
    display: flex;
    align-items: center;
    justify-content: flex-start;
  }
  
  .flex-x-end {
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
  
  .flex-y-end {
      display: flex;
      align-items: flex-end;
  }
  
  .flex-y-baseline {
      display: flex;
      align-items: baseline;
  }


@import url('./element.less');